/* CSS reset@ */
@font-face {
	font-family:fz;
	src: url('http://www.jnban.com/fonts/FE08015T.TTF');
}

body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl,dt,dd,ul,ol,li,pre,form,fieldset,legend,button,input,textarea,th,td,a{padding:0;margin:0;}
table {border-collapse: collapse;border-spacing:0;}
del, ins {text-decoration:none;}
fieldset, img {border:0;}.unLock{ overflow:hidden;}
body{ overflow-x:hidden; position:relative;}
body,button,textarea{font:14px/1.6 "Microsoft YaHei",微软雅黑, Arial, sans-serif;color:#333;-webkit-text-size-adjust: none;}
input,select{font:14px/1.6 "Microsoft YaHei",微软雅黑, Arial, sans-serif;color:#333;}
input,select,img{vertical-align:middle;}img{ max-width:100%;}
input,select{outline:none;-webkit-appearance: none;}
select{height:22px;line-height:18px;padding:2px;}
ul,ol{list-style:none;}
h1, h2, h3, h4, h5, h6 {font-size:14px; font-weight:normal;}
address,cite,dfn,em,var{font-style:normal;}
legend{display:none;}
td{font-size:14px;line-height:140%;}
label{margin:0;cursor:pointer;}
input::-moz-focus-inner,button::-moz-focus-inner{border:0;padding:0;}
.left{float:left;}
.right{float:right;}
.mt10{margin-top:10px;}
.mt15{margin-top:15px;}
.mt20{margin-top:20px;}
a{color:#333;text-decoration:none; -webkit-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s;}
a:hover{color:#005dd0;text-decoration:none;}
i{ font-style:normal;}
.txthide{text-indent:-999em;overflow:hidden;line-height:0;font-size:0}
.clearfix:after{content:"";height:0;visibility:hidden;display:block;clear:both;}
.clearfix{zoom:1;}
.clear{clear:both;height:0;overflow:hidden;}
*, *:after, *:before{ padding:0;margin:0;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-o-box-sizing: border-box;box-sizing: border-box;}
.flex-centerbox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.fr{ float:right;}.fl{ float:left;}
.header{ width:100%; height:90px; background:#053992; position:static; z-index:9999;}
.header-menu{ width:100%; height:90px; line-height:90px; position:relative;}
.header-menu img{ width:auto; height:59px; position:absolute; top:16px; left:49px;}
.header-nav{ padding:0 20px; position:absolute; right:103px; background:#043583;}
.header-nav ul li{ float:left;}
.header-nav ul li a{ font-size:15px; color:#fff; padding:0 35px; display:block;}
.header-en{ width:103px; height:90px; background:#042e71; position:absolute; top:0; right:0;}
.header-en a{ color:#fff; text-align:center; display:block;}



.footer{ width:100%; background:#eeedec; color:#adabab; min-height:auto !important; height:auto !important;}
.footer .footer-nav{ padding:0 30px; height:43px; border-bottom:1px solid #fff;}
.footer .footer-nav .qq{ float:right;}
.footer .footer-nav .qq .iconfont{ font-size:20px; line-height:42px; color:#b5b5b9;}
.footer .footer-nav .qq .iconfont:hover{ color:#005dd0;}
.footer .footer-nav ul li{ float:left;}
.footer .footer-nav ul li a{ height:42px; line-height:42px; padding:0 30px; display:block; color:#adabab;}
.footer .footer-nav ul li a:hover{ background:#fff; color:#005dd0;}

.footer .footer-content{ overflow:hidden;}
.footer .footerBox1{ float:left; width:18%; padding:72px 0 0 60px;}
.footer .footerBox1 ul li { text-align:left;}
.footer .footerBox1 ul li a{ font-size:14px; color:#adabab; height:35px; line-height:35px; text-transform:uppercase;}
.footer .footerBox1 ul li a:hover{ font-size:18px; color:#005dd0; font-weight:bold;}
.footer .footerBox2{ float:left; width:64%; padding:60px 0 0;}
.footer .footer-logo{ text-align:center;}
.footer .footer-search{ width:709px; overflow:hidden; margin:60px auto 30px; font-size:12px; color:#adabab;}
.footer .footer-search .tint{ width:642px; height:39px; font:14px "Microsoft YaHei"; background:#f6f6f5; color:#adabaa; line-height:37px; padding-left:14px; float:left; border:1px solid #fff; border-right:0;-webkit-appearance: none;}
.footer .footer-search .bint{ width:67px; height:39px; background:#fff url(../images/icon-search.png) no-repeat center center; background-size:25px; font:14px "Microsoft YaHei"; color:#adabaa; border:none; cursor:pointer;float:right;}
.footer .footer-intro{ font-size:12px; color:#adabab; padding:0 0 35px; text-align:center; text-transform:uppercase;}
.footer .footer-intro a{ color:#adabab;}
.footer .footer-intro a:hover{ color:#005dd0;}

.footer .footerBox3{ float:left; width:18%; padding:60px 0 30px;}
.footer .footer-contactTitle{ font-size:32px; color:#fff; letter-spacing:5px; line-height:80px; font-weight:lighter; text-transform:uppercase; font-style:italic;}
.footer .footerBox3 ul li{ overflow:hidden; line-height:22px; margin-bottom:15px;}
.footer .footerBox3 ul li span{ float:left; width: 30%; width:40px; font-size:20px;}
.footer .footerBox3 ul li span.icon-Fax{ font-size:26px;}
.footer .footerBox3 ul li p{ float:left; width: 70%;}

.footer .footer-copyright{ font-size:12px; color:#eeedec; background:#1a1919; padding:12px 60px; line-height:24px; overflow:hidden; text-align:center;}
.footer .footer-copyright a{ font-size:12px; color:#eeedec;}
.footer .footer-copyright a:hover{ color:#fff;}

.right_side{ position: absolute; right: 0; top: 35%; width: 60px; height: 245px; z-index: 80000; }
.right_side ul{}
.right_side ul li{ width: 60px; height: 60px; border-bottom: 1px solid #3197f0; background: #2c88d8 url(../images/right_ico.png) no-repeat; cursor: pointer; position:relative;-webkit-transition:  background 0.5s ease-out ; -moz-transform:background 0.5s ease-out; transition: background 0.5s ease-out ; }
.right_side ul li:hover{ background:#FFFFFF url(../images/right_hover_ico.png) no-repeat; }

.right_side ul li.qq{  background-position: center 17px;    }
.right_side ul li.qq div{ display: none; background-color: #f9f9f9; position: absolute; right: 60px; width: 180px; height: 180px; border-bottom-left-radius: 5px; border-top-left-radius: 5px; overflow: hidden; -moz-box-shadow:-7px 0px 10px rgba(0,0,0,0.2); -webkit-box-shadow:-7px 0px 10px rgba(0,0,0,0.2); box-shadow:-7px 0px 10px rgba(0,0,0,0.2); }
.right_side ul li.qq div dt{ text-align: center; height: 60px; line-height: 60px; background-color: #ffffff; }
.right_side ul li.qq div dd{height: 60px; line-height: 60px; color: #666666; margin: 0 auto; width: 160px; font-size: 16px; text-indent: 80px; background: url(../images/qqbg.gif) no-repeat 30px 17px;}
.right_side ul li.qq div dd a{ display: block;}
.right_side ul li.qq div dd a:hover{ color: #556c9c;}

.right_side ul li.tel{ background-position: center -44px; }
.right_side ul li.tel div{ display: none; border-bottom-left-radius: 5px; border-top-left-radius: 5px;  position: absolute;  right: 60px;-moz-box-shadow:-7px 0px 10px rgba(0,0,0,0.3); -webkit-box-shadow:-7px 0px 10px rgba(0,0,0,0.3); box-shadow:-7px 0px 10px rgba(0,0,0,0.3); height: 60px; line-height: 60px; padding: 0 20px; font-size: 24px; font-weight: bold; color: #217cc8; background-color: #fff; white-space: nowrap }
.right_side ul li.wx{  background-position: center -105px; border-top-left-radius: 5px;}
.right_side ul li.wx div{ border-radius: 5px; display: none; position: absolute; top: -45px; right: 60px;-moz-box-shadow:-7px 0px 10px rgba(0,0,0,0.3); -webkit-box-shadow:-7px 0px 10px rgba(0,0,0,0.3); box-shadow:-7px 0px 10px rgba(0,0,0,0.3); overflow: hidden; }
.right_side ul li.topback{ background-position: center -166px; border: none; border-bottom-left-radius: 5px; }
.right_side ul li:hover div{ display: block;}
.right_side ul li.qq:hover{ border-radius: 0;}
.right_side ul li img{ max-width:none;}
.right_side #returnTop a{ width:60px; height:60px; display:block; text-indent:-9999px;}

.izl-rmenu{position:fixed; right:0; margin-right:20px; bottom:20px; padding-bottom:20px; z-index:999;
 _position:absolute; 
_top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));
 /* for IE6 */ overflow:visible;}
.izl-rmenu .btn{width:51px; height:51px; margin-bottom:9px; cursor:pointer; position:relative;}

.izl-rmenu .btn-top{font-family:Arial, Helvetica, sans-serif; width:45px;height:40px;padding:5px 0 0;line-height:40px;text-align:center;background-image:url(../images/ico_top.png);background-position:center 9px;background-repeat:no-repeat;background-color:#2e84eb;color:#fff;font-size:14px;font-weight:bold;cursor:pointer; display:none;filter:alpha(opacity=30); -moz-opacity:0.3; -khtml-opacity: 0.8; opacity: 0.3;}
.izl-rmenu .btn-top:hover{filter:alpha(opacity=100); -moz-opacity:1; -khtml-opacity:1; opacity:1;}

@font-face {
  font-family: 'iconfont';
  src: url('../font/iconfont.eot');
  src: url('../font/iconfont.eot') format('embedded-opentype'),
      url('../font/iconfont.woff2') format('woff2'),
      url('../font/iconfont.woff') format('woff'),
      url('../font/iconfont.ttf') format('truetype'),
      url('../font/iconfont.svg') format('svg');
}

.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-search:before {
  content: "\e671";
}

.icon-email:before {
  content: "\e602";
}

.icon-qq:before {
  content: "\e604";
}

.icon-tel:before {
  content: "\e642";
}

.icon-Fax:before {
  content: "\e605";
}

.icon-iPhone:before {
  content: "\e68e";
}

.icon-address:before {
  content: "\e607";
}




/*  css animation  */
.trans{
/*    -webkit-transition: all .4s ease-in;
    -moz-transition:all .4s ease-in;
    -o-transition:all .4s ease-in;
    -ms-transition:all .4s ease-in;
    transition:all .4s ease-in;*/
}

@media (min-width:325px){
  /* page animation  */
  .ani-view {
      opacity: 0;
      opacity: 1\9;
      opacity: 1\0/;
      opacity: 1\0/;
  }
  @-webkit-keyframes fadeInDown{
      0% {
          opacity:0;
          -webkit-transform:translateY(40px)
      }
      100% {
          opacity:1;
          -webkit-transform:translateY(0)
      }
  }
  @-moz-keyframes fadeInDown{
      0% {
          opacity:0;
          -moz-transform:translateY(40px)
      }
      100% {
          opacity:1;
          -moz-transform:translateY(0)
      }
  }
  @-o-keyframes fadeInDown {
      0% {
          opacity:0;
          -o-transform:translateY(40px)
      }
      100% {
          opacity:1;
          -o-transform:translateY(0)
      }
  }
  @keyframes fadeInDown {
      0% {
          opacity:0;
          transform:translateY(40px)
      }
      100% {
          opacity:1;
          transform:translateY(0)
      }
  }

  .ani-view.fade-in-down{
      opacity:0;
      opacity: 1\9;
      opacity: 1\0/;
      -webkit-transform:translateY(40px);
      -moz-transform:translateY(40px);
      -o-transform:translateY(40px);
      transform:translateY(40px);
  }
  .ani-view.fadeInDown{
      -webkit-animation:fadeInDown 1s cubic-bezier(.25,.74,.22,.99) forwards;
      -moz-animation:fadeInDown 1s cubic-bezier(.25,.74,.22,.99) forwards;
      -o-animation:fadeInDown 1s cubic-bezier(.25,.74,.22,.99) forwards;
      animation:fadeInDown 1s cubic-bezier(.25,.74,.22,.99) forwards;
      -webkit-animation-delay:0.1s; 
      -moz-animation-delay:0.1s;
      -o-animation-delay:0.1s;
      animation-delay:0.1s;
  }


  @-webkit-keyframes fadeInLeft {
      0% {
          opacity:0;
          -webkit-transform:translateX(-100px)
      }
      100% {
          opacity:1;
          -webkit-transform:translateX(0)
      }
  }
  @-moz-keyframes fadeInLeft {
      0% {
          opacity:0;
          -moz-transform:translateX(-100px)
      }
      100% {
          opacity:1;
          -moz-transform:translateX(0)
      }
  }
  @-o-keyframes fadeInLeft {
      0% {
      opacity:0;
      -o-transform:translateX(-100px)
      }
      100% {
      opacity:1;
      -o-transform:translateX(0)
      }
  }
  @keyframes fadeInLeft {
      0% {
      opacity:0;
      transform:translateX(-100px)
      }
      100% {
      opacity:1;
      transform:translateX(0)
      }
  }
  .ani-view.fade-in-left{
      opacity:0;
      opacity: 1\9;
      opacity: 1\0/;
      -webkit-transform:translateX(-100px);
      -moz-transform:translateX(-100px);
      -o-transform:translateX(-100px);
      transform:translateX(-100px);
  }
  .ani-view.fadeInLeft {
      -webkit-animation:fadeInLeft 1s cubic-bezier(.25,.74,.22,.99) forwards;
      -moz-animation:fadeInLeft 1s cubic-bezier(.25,.74,.22,.99) forwards;
      -o-animation:fadeInLeft 1s cubic-bezier(.25,.74,.22,.99) forwards;
      animation:fadeInLeft 1s cubic-bezier(.25,.74,.22,.99) forwards;
      -webkit-animation-delay:0.1s; 
      -moz-animation-delay:0.1s;
      -o-animation-delay:0.1s;
      animation-delay:0.1s;
  }

  @-webkit-keyframes fadeInRight {
      0% {
      opacity:0;
      -webkit-transform:translateX(100px)
      }
      100% {
      opacity:1;
      -webkit-transform:translateX(0)
      }
  }
  @-moz-keyframes fadeInRight {
      0% {
      opacity:0;
      -moz-transform:translateX(100px)
      }
      100% {
      opacity:1;
      -moz-transform:translateX(0)
      }
  }
  @-ms-keyframes fadeInRight {
      0% {
      opacity:0;
      -ms-transform:translateX(100px)
      }
      100% {
      opacity:1;
      -ms-transform:translateX(0)
      }
  }
  @-o-keyframes fadeInRight {
      0% {
      opacity:0;
      -o-transform:translateX(100px)
      }
      100% {
      opacity:1;
      -o-transform:translateX(0)
      }
  }
  @keyframes fadeInRight {
      0% {
      opacity:0;
      transform:translateX(100px)
      }
      100% {
      opacity:1;
      transform:translateX(0)
      }
  }
  .ani-view.fade-in-right{
      opacity:0;
      opacity: 1\9;
      opacity: 1\0/;
      -webkit-transform:translateX(100px);
      -moz-transform:translateX(100px);
      -o-transform:translateX(100px);
      transform:translateX(100px);
  }
  .ani-view.fadeInRight {
      -webkit-animation:fadeInRight 1s cubic-bezier(.25,.74,.22,.99) forwards;
      -moz-animation:fadeInRight 1s cubic-bezier(.25,.74,.22,.99) forwards;
      -o-animation:fadeInRight 1s cubic-bezier(.25,.74,.22,.99) forwards;
      animation:fadeInRight 1s cubic-bezier(.25,.74,.22,.99) forwards;
      -webkit-animation-delay:0.1s; 
      -moz-animation-delay:0.1s;
      -o-animation-delay:0.1s;
      animation-delay:0.1s;
  }
  .ani-view.ani_delay2{
    -webkit-animation-delay:0.2s; 
    -moz-animation-delay:0.2s;
    -o-animation-delay:0.2s;
    animation-delay:0.2s;
  }
  .ani-view.ani_delay3{
    -webkit-animation-delay:0.3s; 
    -moz-animation-delay:0.3s;
    -o-animation-delay:0.3s;
    animation-delay:0.3s;
  }
  .ani-view.ani_delay4{
    -webkit-animation-delay:0.4s; 
    -moz-animation-delay:0.4s;
    -o-animation-delay:0.4s;
    animation-delay:0.4s;
  }
  .ani-view.ani_delay5{
    -webkit-animation-delay:0.5s; 
    -moz-animation-delay:0.5s;
    -o-animation-delay:0.5s;
    animation-delay:0.5s;
  }
  .ani-view.ani_delay6{
    -webkit-animation-delay:0.6s; 
    -moz-animation-delay:0.6s;
    -o-animation-delay:0.6s;
    animation-delay:0.6s;
  }
  .ani-view.ani_delay7{
    -webkit-animation-delay:0.7s; 
    -moz-animation-delay:0.7s;
    -o-animation-delay:0.7s;
    animation-delay:0.7s;
  }
  .ani-view.ani_delay8{
    -webkit-animation-delay:0.8s; 
    -moz-animation-delay:0.8s; 
    -o-animation-delay:0.8s; 
    animation-delay:0.8s; 
  }
  .ani-view.ani_delay9{
    -webkit-animation-delay:0.9s; 
    -moz-animation-delay:0.9s;
    -o-animation-delay:0.9s;
    animation-delay:0.9s;
  }
  .ani-view.ani_delay10{
    -webkit-animation-delay:1s; 
    -moz-animation-delay:1s;
    -o-animation-delay:1s;
    animation-delay:1s;
  }
  .ani-view.ani_delay11{
    -webkit-animation-delay:1.1s; 
    -moz-animation-delay:1.1s; 
    -o-animation-delay:1.1s; 
    animation-delay:1.1s; 
  }
  .ani-view.ani_delay12{
    -webkit-animation-delay:1.2s; 
    -moz-animation-delay:1.2s; 
    -o-animation-delay:1.2s; 
    animation-delay:1.2s; 
  }
  .ani-view.ani_delay13{
    -webkit-animation-delay:1.3s; 
    -moz-animation-delay:1.3s;  
    -o-animation-delay:1.3s;  
    animation-delay:1.3s;  
  }
  .ani-view.ani_delay14{
    -webkit-animation-delay:1.4s; 
    -moz-animation-delay:1.4s; 
    -o-animation-delay:1.4s; 
    animation-delay:1.4s; 
  }
  .ani-view.ani_delay15{
    -webkit-animation-delay:1.5s; 
    -moz-animation-delay:1.5s;  
    -o-animation-delay:1.5s;  
    animation-delay:1.5s;  
  }
  .ani-view.ani_delay16{
    -webkit-animation-delay:1.6s; 
    -moz-animation-delay:1.6s;
    -o-animation-delay:1.6s;
    animation-delay:1.6s;
  }
  .ani-view.ani_delay17{
    -webkit-animation-delay:1.7s; 
    -moz-animation-delay:1.7s; 
    -o-animation-delay:1.7s; 
    animation-delay:1.7s; 
  }
  .ani-view.ani_delay18{
    -webkit-animation-delay:1.8s; 
    -moz-animation-delay:1.8s; 
    -o-animation-delay:1.8s; 
    animation-delay:1.8s; 
  }
  .ani-view.ani_delay19{
    -webkit-animation-delay:1.9s; 
    -moz-animation-delay:1.9s; 
    -o-animation-delay:1.9s; 
    animation-delay:1.9s; 
  }
  .ani-view.ani_delay20{
    -webkit-animation-delay:2s; 
    -moz-animation-delay:2s; 
    -o-animation-delay:2s; 
    animation-delay:2s; 
  }



  .fade-in-box{
      width: 100%; 
      height:100%;
      position: absolute;
      top:0%;
      left: 0%;
      background: url(http://www.jnban.com/img/img34.png) center/cover no-repeat;
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1);
  }
  .fade-in-box.on{
      -webkit-animation:fade 1.2s ease-in-out forwards;
      -moz-animation:fade 1.2s ease-in-out forwards;
      -o-animation:fade 1.2s ease-in-out forwards;
      animation:fade 1.2s ease-in-out forwards;
  }
  @-webkit-keyframes fade{
      0% {
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1);
      }
      99% {
      -webkit-transform: scale3d(25,25,25);
      transform: scale3d(25,25,25);
      }
      100%{
          -webkit-transform: scale3d(25,25,25);
          transform: scale3d(25,25,25);
          display: none;
      }
  }
  @-moz-keyframes fade{
     0% {
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1);
      }
      99% {
      -webkit-transform: scale3d(25,25,25);
      transform: scale3d(25,25,25);
      }
      100%{
          -webkit-transform: scale3d(25,25,25);
          transform: scale3d(25,25,25);
          display: none;
      }
  }
  @-ms-keyframes fade{
     0% {
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1);
      }
      99% {
      -webkit-transform: scale3d(25,25,25);
      transform: scale3d(25,25,25);
      }
      100%{
          -webkit-transform: scale3d(25,25,25);
          transform: scale3d(25,25,25);
          display: none;
      }
  }
  @-o-keyframes fade{
      0% {
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1);
      }
      99% {
      -webkit-transform: scale3d(25,25,25);
      transform: scale3d(25,25,25);
      }
      100%{
          -webkit-transform: scale3d(25,25,25);
          transform: scale3d(25,25,25);
          display: none;
      }
  }
  @keyframes fade{
      0% {
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1);
      }
      99% {
      -webkit-transform: scale3d(25,25,25);
      transform: scale3d(25,25,25);
      }
      100%{
          -webkit-transform: scale3d(25,25,25);
          transform: scale3d(25,25,25);
          display: none;
      }
  }

  .Fade-Inbox{
      width: 100%; 
      height:100%;
      position: absolute;
      top:0%;
      left: 0%;
      background: url(http://www.jnban.com/img/100.png) center/cover no-repeat;
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1);
      -webkit-animation:Fabox 0.9s 0.2s ease-in-out forwards;
      -moz-animation:Fabox 0.9s 0.2s ease-in-out forwards;
      -o-animation:Fabox 0.9s 0.2s ease-in-out forwards;
      animation:Fabox 0.9s 0.2s ease-in-out forwards;
  }

  @-webkit-keyframes Fabox{
      0% {
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1);
      }
      99% {
      -webkit-transform: scale3d(18,18,1);
      transform: scale3d(18,18,1);
      }
      100%{
          -webkit-transform: scale3d(18,18,1);
          transform: scale3d(18,18,1);
          display: none;
      }
  }
  @-moz-keyframes Fabox{
      0% {
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1);
      }
      99% {
      -webkit-transform: scale3d(30,30,1);
      transform: scale3d(30,30,1);
      }
      100%{
          -webkit-transform: scale3d(30,30,1);
          transform: scale3d(30,30,1);
          display: none;
      }
  }
  @-ms-keyframes Fabox{
      0% {
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1);
      }
      99% {
      -webkit-transform: scale3d(30,30,1);
      transform: scale3d(30,30,1);
      }
      100%{
          -webkit-transform: scale3d(30,30,1);
          transform: scale3d(30,30,1);
          display: none;
      }
  }
  @-o-keyframes Fabox{
      0% {
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1);
      }
      99% {
      -webkit-transform: scale3d(30,30,1);
      transform: scale3d(30,30,1);
      }
      100%{
          -webkit-transform: scale3d(30,30,1);
          transform: scale3d(30,30,1);
          display: none;
      }
  }
  @keyframes Fabox{
      0% {
      -webkit-transform: scale3d(1,1,1);
      transform: scale3d(1,1,1);
      }
      99% {
      -webkit-transform: scale3d(30,30,1);
      transform: scale3d(30,30,1);
      }
      100%{
          -webkit-transform: scale3d(30,30,1);
          transform: scale3d(30,30,1);
          display: none;
      }
  }
}

/* 动画绑定 */

@-webkit-keyframes move_right {
from {
opacity: 0;
}
to {
opacity: 1;
-webkit-transform: translateX(120px);
transform: translateX(120px);
}
}
@keyframes move_right {
from {
opacity: 0;
}
to {
opacity: 1;
-webkit-transform: translateX(120px);
transform: translateX(120px);
}
}


.move_right {
-webkit-animation-name : move_right;
animation-name : move_right;
-webkit-animation-duration : 1s;
animation-duration : 1s;
-webkit-animation-iteration-count : 1;
animation-iteration-count : 1;
-webkit-animation-fill-mode : forwards;
animation-fill-mode : forwards;
}


.viewport-tip{position: absolute;z-index: 0;background: rgba(0,0,0,.59);width: 100%;height: 100%;top: 0;transition: all .5s;opacity: 0;display: none;}
.viewport-tip .overload{content: '';background: url(http://www.jnban.com/images/tip.png);background-size:.865rem;width: .865rem;height: .865rem;position: absolute;left: 50%;top: 50%;margin: -.4325rem 0 0 -.4325rem; }
.showOn{z-index: 99999999;opacity: 1;display: block;}